// 按钮基础样式
.el-button {
  border-radius: 4px;
  font-weight: 500;
  transition: all 0.3s ease;
  
  // 主要按钮
  &.el-button--primary {
    background: linear-gradient(135deg, #409EFF 0%, #3a8ee6 100%);
    border: none;
    box-shadow: 0 2px 6px rgba(64, 158, 255, 0.2);
    
    &:hover {
      background: linear-gradient(135deg, #66b1ff 0%, #409EFF 100%);
      transform: translateY(-1px);
      box-shadow: 0 4px 12px rgba(64, 158, 255, 0.3);
    }
    
    &:active {
      transform: translateY(0);
      box-shadow: 0 2px 4px rgba(64, 158, 255, 0.2);
    }
  }
  
  // 成功按钮
  &.el-button--success {
    background: linear-gradient(135deg, #67C23A 0%, #5daf34 100%);
    border: none;
    box-shadow: 0 2px 6px rgba(103, 194, 58, 0.2);
    
    &:hover {
      background: linear-gradient(135deg, #85ce61 0%, #67C23A 100%);
      transform: translateY(-1px);
      box-shadow: 0 4px 12px rgba(103, 194, 58, 0.3);
    }
    
    &:active {
      transform: translateY(0);
      box-shadow: 0 2px 4px rgba(103, 194, 58, 0.2);
    }
  }
  
  // 警告按钮
  &.el-button--warning {
    background: linear-gradient(135deg, #E6A23C 0%, #cf9236 100%);
    border: none;
    box-shadow: 0 2px 6px rgba(230, 162, 60, 0.2);
    
    &:hover {
      background: linear-gradient(135deg, #ebb563 0%, #E6A23C 100%);
      transform: translateY(-1px);
      box-shadow: 0 4px 12px rgba(230, 162, 60, 0.3);
    }
    
    &:active {
      transform: translateY(0);
      box-shadow: 0 2px 4px rgba(230, 162, 60, 0.2);
    }
  }
  
  // 危险按钮
  &.el-button--danger {
    background: linear-gradient(135deg, #F56C6C 0%, #e64242 100%);
    border: none;
    box-shadow: 0 2px 6px rgba(245, 108, 108, 0.2);
    
    &:hover {
      background: linear-gradient(135deg, #f78989 0%, #F56C6C 100%);
      transform: translateY(-1px);
      box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3);
    }
    
    &:active {
      transform: translateY(0);
      box-shadow: 0 2px 4px rgba(245, 108, 108, 0.2);
    }
  }
  
  // 信息按钮
  &.el-button--info {
    background: linear-gradient(135deg, #909399 0%, #82848a 100%);
    border: none;
    box-shadow: 0 2px 6px rgba(144, 147, 153, 0.2);
    
    &:hover {
      background: linear-gradient(135deg, #a6a9ad 0%, #909399 100%);
      transform: translateY(-1px);
      box-shadow: 0 4px 12px rgba(144, 147, 153, 0.3);
    }
    
    &:active {
      transform: translateY(0);
      box-shadow: 0 2px 4px rgba(144, 147, 153, 0.2);
    }
  }
  
  // 文本按钮
  &.el-button--text {
    padding: 0;
    height: auto;
    line-height: 1.5;
    font-weight: normal;
    
    &:hover {
      color: #66b1ff;
    }
    
    &.is-disabled {
      color: #909399;
    }
  }
  
  // 禁用状态
  &.is-disabled {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
  }
  
  // 加载状态
  &.is-loading {
    position: relative;
    pointer-events: none;
    
    &::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(255, 255, 255, 0.1);
      border-radius: 4px;
    }
  }
}

// 按钮组样式
.el-button-group {
  .el-button {
    &:not(:first-child) {
      margin-left: 0;
      border-left: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    &:first-child {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }
    
    &:last-child {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }
  }
} 